<style>
#uploadBtnHolder,#uploadBtnHolder2{display: block;width: 60px;height: 60px;}
</style>
<div class="page_title">
    <h2 class="fl">{$pageTitle}</h2>
    <a class="fr top_rt_btn iconfont iconfont-chexiao" href="{:U('admin/Gift/gift')}">返回列表</a>
</div>
<section>
    <ul class="ulColumn2">
        <input type="hidden" name="config_id" value="{:encrypt_id($config.config_id)}" />
        <li>
            <span class="item_name" style="width:180px;">默认直播间标题：</span>
            <input name="stream_title" type="text" class="textbox textbox_295" value="{$config.value.stream_title}" maxlength="14" placeholder=""/>
            <div class="tishi"><i class="iconfont iconfont-tishi"></i><div style="display: inline-flex;max-width: 260px;letter-spacing: 1px;">标题中自定义文字(除替换字符)不得超过7位,用户昵称标识为[uname],默认标题仅在主播未设置标题时生效</div></div>
        </li>
                <li>
            <span class="item_name" style="width:180px;">开启直播实时截图：</span>
            <input type="checkbox" id="checkbox_d1" class="chk_4 stream_snapshot " {eq name="config.value.stream_snapshot" value="1"}checked{/eq} />
            <label for="checkbox_d1">
                <input type="hidden" name="stream_snapshot" value="{$config.value.stream_snapshot}"/>
            </label>
            <div class="tishi"><i class="iconfont iconfont-tishi"></i>若关闭该功能,请上传默认封面图,</div>
        </li>
        <li id="stream_icon" style="display: {eq name='config.value.stream_snapshot' value='0'}block{else /}none{/eq};">
            <span class="item_name" style="width:180px;">默认封面图：</span>
            <label class="uploadImg">
                <a id="uploadBtnHolder"></a>
                <span>上传图片</span>
                <input type="hidden" name="stream_icon" value="{:encrypt_id($config.value.stream_icon)}" />
            </label>
            <div class="uploadImg-box clearfix" id="uploadImg_one" data-type="one" style="margin-left: 184px;">
                <label class="uploadImg-item" style="background:url({:getImageUrl($config.value.stream_icon,4)}) no-repeat center;background-size: 100%;">
                    <span class="uploadImg-delete" data-id="{:encrypt_id($config.value.stream_icon)}"></span>
                </label>
            </div>
            <div class="tishi" style="display: block;margin:8px 180px;"><i class="iconfont iconfont-tishi"></i>建议上传720*1080的图片,大小不得超过1M,其他比例请尽量上传等比例图片</div>
        </li>
        <li>
            <span class="item_name" style="width:180px;"></span>
            <input type="submit" class="link_btn" value="完成编辑"/>
        </li>
    </ul>
</section>
<script>
$(function(){
    //上传初始化
    initSwf1 = admin.initUpload($("#uploadBtnHolder"),'stream_config_icon',{size:'1 MB'});
    //事件处理
    /** 上传进度 **/
    initSwf1.uploadProgress = function(file, bytesComplete, bytesTotal){
        var percent = Math.ceil((bytesComplete / file.size) * 100);
        if(percent >= 100){
            return true;
        }
        upload_progress_callcack($("#uploadImg_one"),percent,file.id)
    }
    /** 上传出错 **/
    initSwf1.uploadError = function(file, errorCode, message){
        upload_error($("#uploadImg_one"));
    }
    /** 上传完成 **/
    initSwf1.uploadSuccess = function(file, data, responseReceived){
        upload_success_callcack($("#uploadImg_one"),data);
    }
    
    //点击删除事件
    $("#uploadImg_one .uploadImg-delete").die().live('click',function(){
        $(this).parent().remove();
        var attach_id = $(this).data('id');
        admin.log(attach_id);
        var send_data = {
            url:U('admin/Stream/rm_upload_image'),
            async:true,
            data:{attach_id:attach_id}
        }
        send_ajax(send_data);
        $("input[name='stream_icon']").val('');
        set_uploadImgBox($("#uploadImg_one"));
    })
    
    function upload_error(obj){
        $(".uploadImg-loading").html('上传失败,请重试');
        $(".uploadImg-loading").css({fontSize:'13px'});
    }
    //上传进度的回调方法
    function upload_progress_callcack(obj,num,fileID){
        if(!$('.uploadImg-loading')[0]){
            var item = '<label class="uploadImg-item" data-fileId="'+fileID+'" style="background:rgba(220, 219, 219, 0.68);">'+
                        '<span class="uploadImg-loading"></span>'+
                        '</label>';
            if(obj.data('type') != 'one'){
                obj.append(item);
            }else{
                obj.html(item);
            }
        }
        $(".uploadImg-loading").html(num+'%');
        set_uploadImgBox(obj);
    }
    //上传成功的回调方法
    function upload_success_callcack(obj,data){
        var data = eval('('+data+')');
        if(data.code != '00000'){
            upload_error(obj);
            return false;
        }
        var urls = data.data[0].urls;
        var item = '<label class="uploadImg-item" style="background:url('+urls[0]+') no-repeat center;background-size: 100%;">'+
                    '<span class="uploadImg-delete" data-id='+data.data[0].attach_id+'></span>'+
                    '</label>';
        if(obj.data('type') != 'one'){
            obj.append(item);
        }else{
            obj.html(item);
        }
        var attach_id = data.data[0].attach_id;
        $("input[name='stream_icon']").val(attach_id);
        $(".uploadImg-loading").parent().remove();
        set_uploadImgBox(obj);
    }
    //计算并设置上传文件列表框的位置
    function set_uploadImgBox(obj){
        var n = obj.find(" .uploadImg-item").length;
        if(n == 0){
            obj.hide();
            return true;
        }else{
            obj.show(500);
            var del_w = parseInt(obj.find(".uploadImg-delete:eq(0)").width())/2;
        }
        var w = parseInt(15) * (n+parseInt(1)) + n * parseInt(obj.find(".uploadImg-item:eq(0)").width()) - del_w;
        obj.css('width',w+'px');
    }
    set_uploadImgBox($("#uploadImg_one"));
    /**
      * 监听input值发生变化
      */
    $('.stream_snapshot').bind('click', function() {
        if($(this).is(":checked")){
            $("#stream_icon").hide();
        }else{
            $("#stream_icon").show();
        }
    });  
    /**
      * 提交
      */
    $("input[type='submit']").click(function(){
        var data = $.extend({},{
            stream_title:$("input[name='stream_title']").val(),
            stream_snapshot:$("input[name='stream_snapshot']").val(),
            stream_icon:$("input[name='stream_icon']").val(),
            config_id:$("input[name='config_id']").val(),
        });
        var send_data = {
            url: U("admin/Stream/stream_config"),
            data:data,
            type:'POST',
            dataType:'json',
        }
        send_ajax(send_data,function(res){
            if(res === false){
                DEBUG && _this.log(ajax_error);
                return false;
            }
            if(res.status == 1){
                msg_success(res.data.info,'',1000);
                setTimeout(function(){
                    admin.getContentByUrl(res.data.jumpurl);
                },1000);
            }else{
                msg_error(res.message);
            }
        });
        
    });
})
</script>